﻿@using VirtualPress.Infrastructure.Entities.Entity;
@{
    ViewBag.Title = "UserInfo";
    Layout = "/Areas/WorkSpace/Views/Shared/_WorkSpace.cshtml";
}
<div id="content-header">
    <h1>
        个人资料</h1>
</div>
<div id="breadcrumb">
    <a href="/WorkSpace/home/index" class="tip-bottom"><i class="icon-home"></i>起始页</a> <a>个人中心</a>
    <a class="current">个人资料</a>
</div>
<div class="container-fluid">
    <div class="row-fluid">
        <div class="span12">
            <div class="widget-box">
                <div class="widget-title">
                    <span class="icon"><i class="icon-pencil"></i></span>
                    <h5>
                        个人资料</h5>
                    <h5 style="float: right; color: Red;">
                        *为必填</h5>
                </div>
                <div class="widget-content nopadding">
                    @{
                        var user = new User().Find(HttpContext.Current.User.Identity.Name);
                    }
                    <form id="userinfoform" class="form-horizontal" method="post" action="/WorkSpace/home/UserInfo">
                    <input type="hidden" name="photo" id="hidphoto" />
                    <div class="span12">
                        @if (!String.IsNullOrEmpty(ViewBag.Message))
                        {
                            <div class="control-group" style="padding-top: 10px;">
                                <div class="alert alert-success span11">
                                    <button class="close" data-dismiss="alert">
                                        ×</button>
                                    @ViewBag.Message
                                </div>
                            </div>
                        }
                    </div>
                    <div class="span12">
                        <div class="step span9">
                            <div class="control-group">
                                <label class="control-label">
                                    姓名 (*)
                                </label>
                                <div class="controls">
                                    <input id="txtNickname" type="text" name="NickName" value="@user.NickName" class="{required:true}" />
                                </div>
                            </div>
                            <div class="control-group">
                                <label class="control-label">
                                    出生日期 (*)
                                </label>
                                <div class="controls">
                                    <div id="datetimepicker" class="input-append span6">
                                        <input data-format="yyyy-MM-dd" type="text" name="birthday"
                                           class="{required:true,dateISO:true}"
                                            value="@user.Birthday.ToString("yyyy-MM-dd")" />
                                        <span class="add-on"><i class="icon-calendar" data-time-icon="icon-time" data-date-icon="icon-calendar">
                                        </i></span>
                                    </div>
                                </div>
                            </div>
                            <div class="control-group">
                                <label class="control-label">
                                    性别
                                </label>
                                <div class="controls">
                                    <select name="gender" style="width: 100px;">
                                        @if (user.Gender == VirtualPress.Infrastructure.Entities.Enum.Gender.Male)
                                        { 
                                            <option value="1" selected="selected">男</option>
                                            <option value="0">女</option>
                                        }
                                        else
                                        {
                                            <option value="1">男</option>
                                            <option value="0" selected="selected">女</option>
                                        }
                                    </select>
                                </div>
                            </div>
                            <div class="control-group">
                                <label class="control-label">
                                    现居地：
                                </label>
                                <div class="controls">
                                    <select name="areaCode" id="sltAreacode" style="width: 100px;">
                                    </select>
                                    <select name="location" id="sltLocation" style="width: 100px;">
                                    </select>
                                </div>
                            </div>
                            <div class="control-group">
                                <label class="control-label">
                                    备用邮箱 (*)</label>
                                <div class="controls">
                                    <input type="text" name="email" class="{required:true,email:true}"
                                        value="@user.Email" />
                                </div>
                            </div>
                            <div class="control-group">
                                <label class="control-label">
                                    联系电话 (*)
                                </label>
                                <div class="controls">
                                    <input type="text" name="phone" class="{required:true}"
                                        value="@user.Phone" />
                                </div>
                            </div>
                            <div class="control-group">
                                <label class="control-label">
                                    常用QQ (*)
                                </label>
                                <div class="controls">
                                    <input type="text" name="qq" class="{required:true}"
                                        value="@user.QQ" />
                                </div>
                            </div>
                        </div>
                        <div class="span3">
                            <div class="row-fluid" style="text-align: center;">
                                <img id="mainphoto" src="@user.Photo" style="width:230px;height:230px;" />
                            </div>
                            <div class="row-fluid" style="text-align: center; padding: 10px 0px 10px;">
                                <div id="swfupload-control">
                                    <div>
                                        <input type="button" id="btnsltphoto" />
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div  class="form-actions">
                        <a class="btn btn-primary" href="/workspace/Member/Author">返回</a>
                        <input id="next" class="btn btn-primary" type="submit" value="保存" />
                    </div>
                    <div id="submitted">
                    </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
@section tail
{
    <script type="text/javascript" src="/scripts/jquery.validate.js"></script>
    <script type="text/javascript" src="/scripts/unicorn.wizard.js"></script>
    <script type="text/javascript" src="/scripts/jquery.metadata.js"></script>
    <script type="text/javascript" src="/scripts/jquery.wizard.js"></script>
    <script type="text/javascript" src="/scripts/plug.js"></script>
    <script type="text/javascript" src="/scripts/swfupload/swfupload.js"></script>
    <script type="text/javascript" src="/scripts/swfupload/jquery.swfupload.js"></script>
    <script type="text/javascript">
        var photo = $('#mainphoto').attr('src');
        $(function () {
            $('#likSelf').addClass('open active');
            new plug.Control().BuildRelationSelect(
                { element: 'sltAreacode', defaultvalue: '@((int)user.Area)' },
                { element: 'sltLocation', defaultvalue: '@((int)user.Location)' }, 'province');

            $('#datetimepicker').datetimepicker({
                pickTime: false
            });
            InstallControlPanel();
            $('#userinfoform').validate({
                errorClass: "help-inline",
                errorElement: "span",
                highlight: function (element, errorClass, validClass) {
                    $(element).parents('.control-group').addClass('error');
                },
                unhighlight: function (element, errorClass, validClass) {
                    $(element).parents('.control-group').removeClass('error');
                }
            });
        });

        var isInstallControlPanel = false;
        function InstallControlPanel() {
            if (isInstallControlPanel) { return; }
            isInstallControlPanel = true;
            new plug.AValidator().BuildValidate('pwdform');
            new plug.AValidator().BuildValidate('infoform');


            $('#swfupload-control').swfupload({
                upload_url: "/WorkSpace/home/SWFPrepareUpload",
                file_size_limit: "7 MB",
                file_types: "*.jpg;*.png",
                file_types_description: "Web Image Files",
                file_upload_limit: 0,
                flash_url: "/scripts/swfupload/swfupload.swf",
                button_image_url: '/scripts/swfupload/updatePhotoBtn.png',
                button_width: 86,
                button_height: 31,
                button_placeholder: $('#btnsltphoto')[0],
                button_action: SWFUpload.BUTTON_ACTION.SELECT_FILE
            })
                .bind('fileQueued', function (event, file) {
                    $(this).swfupload('startUpload');
                })
                .bind('uploadStart', function (event) {
                    $('#mainphoto').attr('src', '/content/img/loading_big.gif');
                })
                .bind('fileQueueError', function (event, file, errorCode, message) {
                    alert(message);
                    $('#mainphoto').attr('src', photo);
                    //$('#log').append('<li>File queue error - ' + message + '</li>');
                })
                .bind('uploadComplete', function (event, file) {
                    $(this).swfupload('startUpload');
                })
                .bind('uploadSuccess', function (event, file, serverData) {
                    var path = eval('(' + serverData + ')').path;
                    $('#mainphoto').attr('src', path);
                    $('#hidphoto').val(path);
                });
        }
    </script>
}
